<script setup>

import Gap from '@/view/ai/components/Gap.vue';
import CardTabs from '@/view/ai/components/CardTabs.vue';
import KeyQuestionBank from '@/view/ai/components/KeyQuestionBank.vue';
import TitleNameTime from '@/view/ai/components/TitleNameTime.vue';
import SummaryDetail from '@/view/ai/components/SummaryDetail.vue';
import KeywordTags from '@/view/ai/components/KeywordTags.vue';
import IconTextNumber from '@/view/ai/components/IconTextNumber.vue';
import HorizontalLine from '@/view/ai/components/HorizontalLine.vue';
import ButtonDiy from '@/view/ai/components/ButtonDiy.vue';

const learnDone = ()=>{
	console.log('learnDone')
}

</script>

<template>
	<div class="policy">
		<card-tabs :tab-index="0" :label-name="'A'">
			<template #left>
				<div class="left">
					<title-name-time/>
					<horizontal-line margin-gap="30"/>
					<keyword-tags />
					<gap height="30"/>
					<key-question-bank />
					<gap height="30"/>
					<button-diy @buttonclick="learnDone"/>
					<horizontal-line margin-gap="18"/>
					<icon-text-number/>
				</div>
			</template>
			<template #middle>
				<div class="right">
					<div class="item">
						<summary-detail/>
					</div>
					<div class="item">
						<summary-detail :title="'大纲：'"/>
					</div>
					<div class="item">
						<summary-detail :title="'时间线：'"/>
					</div>
					<div class="item">
						<summary-detail :title="'结论：'"/>
					</div>
					<div class="item">
						<summary-detail :title="'局限性：'"/>
					</div>
				</div>
			</template>
		</card-tabs>
	</div>
</template>

<style scoped lang="scss">
.policy{
	.left{

	}
	.right{
		padding: 40px;
		.item{
			margin-bottom: 20px;
			&:last-child{
				margin-bottom: 0;
			}
		}
	}
}
</style>
